<!-- 考勤统计 -->
<template>
  <div style="height:100%;">
    <vxe-grid
      id="OfficedocReceivedList"
      ref="vxeTable"
      size="small"
      style="padding:10px;"
      v-bind="options"
      :columns="columns"
      :data="dataSource"
      height="100%"
      @toolbar-button-click="toolbarButtonClickEvent"
      @checkbox-all="onSelectChange"
      @checkbox-change="onSelectChange"
    >

      <template v-slot:appendix="{ row }">
        <a-dropdown v-if="row.appendix">
          <a >附件<a-icon type="down" /></a>
          <a-menu slot="overlay">
            <template v-for="(file,index) in row.appendix.split(',')">
              <a-menu-item :key="index">
                <a @click.prevent="downloadItem(file)" :href="file">{{file}}</a>
              </a-menu-item>
            </template>
          </a-menu>
        </a-dropdown>
      </template>
      <template v-slot:operate="{ row }">
        <a @click="pdfPreview(row)">查看</a>
      </template>
    </vxe-grid>
    <pdf-preview-modal @onload="onIframeLoad" ref="pdfmodal" />
  </div>
</template>
<script >
import { VxeTableMixin } from '@/mixins/VxeTableMixin'
import { filterDictTextByCache } from '@/components/dict/JDictSelectUtil'
import PdfPreviewModal from '@/views/jeecg/modules/PdfPreviewModal'
import { getAction } from '@/api/manage'
import Axios from 'axios'
import { ACCESS_TOKEN } from '@/store/mutation-types'
import Vue from 'vue'
export default {
  name: 'OfficedocReceivedList',
  mixins: [VxeTableMixin],
  components: {
    PdfPreviewModal
  },
  data() {
    return {
      columns: [
        { type: 'checkbox', width: 50 },
        { type: 'seq', width: 60 },
        { field: 'title', title: '标题', showOverflow: true },
        { field: 'type', title: '文件分类', slots: { default: ({ row }) => {
          return filterDictTextByCache('hr_officedoc_type', row.type)
        } }},
        { field: 'status', title: '审核状态', slots: { default: ({ row }) => {
          return filterDictTextByCache('hr_officedoc_status', row.status)
        } }},
        { field: 'outDate', title: '发布时间', showOverflow: true },
        { field: 'topType', title: '置顶', slots: { default: ({ row }) => {
          let text = ''
          switch (row.topType) {
            case '1':
              text = '不置顶'
              break
            case '2':
              text = '置顶'
              break
            case '3':
              text = '永久置顶'
              break
            default:
          }
          return text
        }
        }},
        {
          title: '查看附件',
          field: 'appendix',
          slots: { default: 'appendix' }
        },
        { field: 'operate', title: '操作', width: 150, slots: { default: 'operate' }}
      ],
      url: {
        list: '/hr/officedoc/listByUser'
      },
      isorter: {
        column: '',
        order: ''
      },
      ipagination: {
        total: 0,
        currentPage: 1,
        pageSize: 5
      }
    }
  },
  computed: {
    options() {
      return {
        border: true,
        resizable: true,
        loading: this.loading,
        align: 'center',
        height: this.height,
        // 'toolbar-config': this.tableToolbar,
        // 'export-config': {},
        'custom-config': { storage: { visible: true, resizable: true }},
        officedocId: ''
      }
    }
  },
  methods: {
    pdfPreview(row) {
      const title = row.file
      this.officedocId = row.id
      const token = Vue.ls.get(ACCESS_TOKEN)
      this.headers = { 'X-Access-Token': token }
      this.$refs.pdfmodal.previewFiles(title, token)
    },
    downloadItem(filePath) {
      const url = filePath ? window._CONFIG['staticDomainURL'] + '/' + filePath : ''
      Axios.get(url, { responseType: 'blob' })
        .then(({ data }) => {
        // 为了简单起见这里blob的mime类型 固定写死了
          const blob = new Blob([data], { type: 'application/vnd.ms-excel' })
          const link = document.createElement('a')
          link.href = window.URL.createObjectURL(blob)
          link.download = url.split('/').pop()
          link.click()
            .catch(error => {
              console.error(error)
            })
        })
    },
    onIframeLoad() { // 标记查看
      getAction('/hr/officedoc/read/' + this.officedocId)
    }
  }
}
</script>
